import {Component, OnInit, ViewEncapsulation, ViewChild} from '@angular/core';

import {Subject} from "rxjs/Subject";
import {SeedInfiniteScroll} from "@shared/components/infinite-scroll/seed-infinite-scroll/seed-infinite-scroll.component";
import {SignUpService} from "@sign-up/sign-up.service";
import {ImageServeService} from "@shared/service/image/image-serve.service";
import {ActivatedRoute, Router} from "@angular/router";
import {ToolsService} from "@shared/service/tools/tools.service";
import {groupInfoVO} from "@interface/index";


@Component({
  selector: 'sign-up-choose-club',
  templateUrl: './sign-up-choose-club.component.html',
  styleUrls: ['./sign-up-choose-club.component.scss'],
  encapsulation: ViewEncapsulation.None
})
export class SignUpChooseClubComponent implements OnInit {

  public selectArr: Array<groupInfoVO> = [];
  public hasChoose: Array<number> = [];
  public ngUnsubscribe: Subject<void> = new Subject<void>();
  public unchose = '';
  public chosed = '';
  public params = {
    pages: 1,
    orderNumber: ''
  };
  @ViewChild(SeedInfiniteScroll) infiniteScroll;

  constructor(
    private signUpSer: SignUpService,
    private imgService: ImageServeService,
    private route: ActivatedRoute,
    private tools: ToolsService,
    private router: Router
  ) {
    this.unchose = this.imgService.getChoseStatus('unselect');
    this.chosed = this.imgService.getChoseStatus('selected');
    this.route.queryParams.takeUntil(this.ngUnsubscribe).subscribe(params => {
      this.params.orderNumber = params['orderNumber'];
    });
  }


  getData() {
    this.signUpSer.getUserClubList(this.params.pages)
      .takeUntil(this.ngUnsubscribe)
      .subscribe(res => {
        this.infiniteScroll.complete();
        if (res.result === '0') {
          this.params.pages++;
          this.selectArr = [...this.selectArr, ...res.data.list];
          // console.log(this.selectArr)
          if (!res.data.hasNextPage) {
            this.infiniteScroll.enable(false);
          }
        }
      });
  }

  save() {
    const orgUserId = this.selectArr[this.hasChoose[0]].orgUserId;
    const data = {
      orderNumber: this.params.orderNumber,
      orgUserId: orgUserId
    };
    this.tools.showLoading();
    this.signUpSer.groupChooseGroup(data).takeUntil(this.ngUnsubscribe)
      .subscribe(res => {
        this.tools.hideLoading();
        if (res.result === '0') {
          // if (res.data.free) {
          //   this.router.navigate(['/payment/result'], {queryParams: {mchOrderNumber: this.params.orderNumber}});
          // } else {
          //   this.router.navigate(['/payment'], {queryParams: {orderNumber: this.params.orderNumber}});
          // }
          this.signUpSer.goToPayOrResult(res.data.status, this.params.orderNumber);
        } else {
          this.tools.showToast(res.msg);
        }
      });
  }

  choose(i: number) {
    // console.log(i);
    if (this.hasChoose.indexOf(i) !== -1) {
      const temp = this.hasChoose.filter(item => {
        return item !== i;
      });
      this.hasChoose = temp;
    } else {
      this.hasChoose.push(i);

    }
  }

  ngOnInit() {
    this.getData();
  }

}
